<template>
  <div class="home-home-index">
    <component
      :is="StoreLayout.current_select.layout[0].com"
      v-if="StoreLayout.current_select.layout && StoreLayout.current_select.layout.length"
      :layout-id="StoreLayout.current_select.layout[0].id"
      :is-edit="false"
      :portlet-list="StoreLayout.current_select.portlets"
      @add-portlet="evt_addPortlet"
    ></component>
  </div>
</template>

<script setup>
import { toRefs, ref } from 'vue'

import { CloseCircleOutlined } from '@ant-design/icons-vue'
import portletSelect from './components/portletSelectPage/portSelect'
import layoutSelect from './components/layoutSelectPage/layoutSelect'
import { storeToRefs } from 'pinia'
import factory from './factory'
import { useStoreMenu } from '@/pinia/menuList'
const StoreLayout = useStoreMenu()

//==小组件选择====================
const isShowPortletSelecPage = ref(false)
const parentInfo = ref({})
const evt_addPortlet = (pInfo) => {
  //pInfo:布局组件传出parentId 与 parentSection, 小组件添加时保存参数
  isShowPortletSelecPage.value = true
  parentInfo.value = pInfo
}
const portletSelected = () => {
  isShowPortletSelecPage.value = false
}

//==布局选择=============
let lyp = StoreLayout.current_select.layout && StoreLayout.current_select.layout.length
const isShowLayoutSelecPage = ref(lyp ? false : true)
const clicklayoutSelect = () => {
  isShowLayoutSelecPage.value = true
}
const layoutSelected = () => {
  isShowLayoutSelecPage.value = false
}
const clicksave = () => {
  console.log(11111111, StoreLayout.current_select)
  factory.savePage(StoreLayout.current_select).then((res) => {
    StoreLayout.backup(StoreLayout.x, StoreLayout.y)
  })
}
</script>

<style lang="less" scoped>
.home-home-index {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  overflow: auto;
  display: flex;
  flex-wrap: wrap;
  user-select: none;
  position: relative;
  .comtop0 {
    position: absolute;
    top: 0px;
  }
  .comtop32 {
    position: absolute;
    top: 32px;
  }
}
</style>
